User Research, UX Design, UI Design & Branding
The Tree+ Register.
Tree+ is a more quick and dirty type of project, with a minimum of user research. The project brief was to design a digital tree register that makes accessible information for all public trees, documentation of tree inspections and the current status of the trees to whom it is of interest to. My concept for the Tree+ application targets tree experts and inspectors.
Problem
A digital tree register is essentially an information system in which the city administration can store the data of trees and locate the trees on a map. It supports tree experts and inspectors in the registration, inspection, and maintenance of a large tree population.
A tree expert's job includes keeping the tree population healthy, checking trees for vitality, growth anomalies, damages and diseases, and curing or felling of diseased trees. In a tree register application, tree experts can document tree inspections directly on site. The application can also be used to find out when the next tree inspection is due. For road safety reasons, the Tree Risk Assessment must be completed twice a year.
In this project, I developed a concept for a new digital tree register of the trees in my city. The goal was to create a prototype with appropriate content, structure and UI design, to be used across platforms, that would allow tree experts and inspectors to monitor the tree population of Augsburg.
Before I started laying out the content and structure for the Tree+ register, I looked at other tree registers for reference and inspiration. I was also able to interview a tree expert to learn about their work and processes, and to clarify what they need in a tree register to monitor a tree population.
1. Other tree registers
Baumsicht is a tree register software widely used by city administrations and tree experts in Germany. It is based on the open-source Geographic Information System QGIS. The user interface is very complex, its use not exactly self-explanatory. Baumsicht doesn't seem to be optimized for usability; users need specific knowledge about the workflows in the software. Therefore, it can hardly be used without in-depth training, or at least working through the exhaustive Baumsicht documentation.
However, the tree register software is rich in information and functionality, that, once I became familiar with the quirks of the user interface, I was able to draw from for my concept for the Tree+ application. Thus, Baumsicht allows user to add trees to the database via the map, retrieve the record of a tree, enter tree data and document tree inspections, select (multiple) trees on the map to edit tree data, move or delete trees, and view trees and tree data as a table.
Another tree register I came across during my desk research is the open-access Belfast Tree Database which organizes public trees into tree species and displays them on a map of the city. Anyone interested can find a tree on the map and view its data, such as species, age, health and tree dimensions.
I found this tree register application more user-friendly due to the reduced content and less complex information architecture in the user interface. However, expert users would miss crucial information needed for the monitoring of a tree population.
From this application, I took the idea of accessing trees by species directly from the map. I also wanted to keep the functionality to locate a tree relative to the user's position using GPS in the mobile version.
2. User needs
From the desk research of other tree registers and an interview with a tree expert, I gained insight into what information and functionality needs to be included in a tree register. The record of a tree needs to provide the following data: ID number, common name, botanical name (species), type of tree (genus), green space, location, age, growth stage, growth vigour, condition, height, spread radius of the treetop, diameter of the trunk, date of last check, date of next check due, damages identified, and tasks to do and done.
As for functionality, tree experts need to be able to get an overview of all trees with their inspection status (map), add a new tree to the database (and map), retrieve the record of a tree and view/edit tree data, and view/edit damages and tasks for a tree (in a tree inspection). I put the minimum requirements towards my concept for the Tree+ register into user stories.
As a tree expert...
I want to add a tree to the map so that I can view and edit the data and tasks for the tree in future tree inspections.
I want to view the status and tasks for all trees on the map so that I know what action is needed for each tree on site.
One shortcoming common in existing tree registers is that they are built for stationary use in their desktop version. Therefore, tree experts rely on printouts when checking and working on the trees on site. Most often, they go about locating a tree by looking for its physical ID tag. My prototype for the Tree+ register should be designed for desktop, as well as mobile use.
Process
After getting a good picture of what tree experts need in a tree register, I moved on to the design of the Tree+ application. In my concept, I followed the mobile-first approach. Before I realized a high-fidelity prototype, I took some time to think again about the content of structure of the application. I did a little bit of sketching of some mobile screens. I also developed a sitemap to be clear about the information architecture.
1. Sketches
One piece of content that is essential to the Tree+ register is the map of the tree population. There is an explanation of the representation of the tree inspection status when users tap the information icon. Users find their location indicated in the map. On the right side of the screen, there is a button to add a tree to the database (and map).
Users can search the map for a specific tree by ID number. As a result, a box with the common name of the tree is displayed and the map zooms in on it. Tapping the box takes users to the data record of the tree. The tree data and picture are editable.
Users can also search for or zoom into a particular green space, such as a park. In this case, the box shows the number of trees in the green space, grouped by their inspection status. Furthermore, it is possible to search for a tree species, with the box displaying the number of trees of that species (in a particular green space). Now, when tapping the box, users go to a list of trees filtered by green space, or species, respectively.
2. Sitemap
Before I started designing the high-fidelity prototype of the Tree+ application, I worked on the information architecture and laid out the structure in a sitemap. I planned the navigation menu of the tree register to contain five links: "Home", "Find Tree", "Locations", "Database" and "Add Tree". Under "Home", there is a start screen, from where users can navigate to the other four pages.
Directly finding a tree by ID number is useful for when a tree expert is on site and looking at the physical tree tag. From "Find Tree", they can access tree data, including the documentation of damages and tasks for a tree.
Under "Locations", users can view the map of all trees with their inspection status. In the mobile version of the application, they can use GPS to locate trees relative to their position. From this screen, they can also search for an ID number to find the tree on the map and navigate to its data record. When searching for a species, or searching for/zooming into a green space, such as a park, users can access a list of trees filtered by species, or green space, respectively. Under "Locations", they can also find a button to add a tree to the register (and map) by filling a form with its data.
Under "Database", users can get the records of all trees directly as a list. They can search for attributes, e. g. ID number, species, location to filter the list accordingly. It makes sense to have the list ordered by ID number, although there could possibly be options to order it by other attributes.
By going to "Add Tree", users can directly access and fill the form with the data of a tree to be added to the register (and map).
Solution
1. Branding
2. Hi-Fi prototype mobile
3. Hi-Fi prototype desktop
